<template>
  <div>
    <img :src="imageSrc" ref="img" :class="imageClass" />
    </div>
</template>

<script>
import defaultImage from '@/assets/fang.jpg'
export default {
  name: 'fallback-image',
  props: ['src', 'srcFallback', 'imageClass'],
  data () {
    return {
      imageSrc: this.src
    }
  },
  mounted () {
    this.$refs.img.onerror = () => {
      this.imageSrc = this.srcFallback || defaultImage
    }
  }
}
</script>
